﻿{% extends 'base/front_base.html' %}
{% load news_filters %}
{% block title %}
	新闻详情 - 小饭桌
{% endblock %}

{% block head %}
<link rel="stylesheet" href="{% static 'css/news/news_detail.min.css' %}">
<script src="{% static 'arttemplate/template-web.js' %}"></script>
<script src="{% static 'js/news_detail.min.js' %}"></script>
<script id="comment-item" type="text/html">
	{% verbatim %}
	<li>
		<div class="comment-info">
			<img class="avatar" src="/dist/images/user.jpg" alt="Alternate Text" />
			<span class="author">{{ comment.author.username }}</span>
			<span class="pub-time">{{ comment.pub_time|timeSince }}</span>
		</div>
		<p class="comment-content">
			{{ comment.content }}
		</p>
	</li>
	{% endverbatim %}
</script>
{% endblock %}

{% block main %}
<div class="main">
	<div class="wrapper">
		<div class="main-content-wrapper">
			<div class="news-header">
				<div class="title">
					<h1>{{ news.title }}</h1>
				</div>
				<div class="author-share">
					<div class="author-photo"></div>
					<div class="news-author">{{ news.author.username }}</div>
					<div class="pub-time">{{ news.pub_time|time_since }}</div>
					<div class="category">{{ news.category.name }}</div>
					<div class="share-to">
						分享至

						<a target="_blank"
						   class="share_weibo"
						   href="https://share.baidu.com/s?type=text&searchPic=1&sign=on&to=tsina&url=https://www.xfz.cn/post/9673.html&f=weibo&title=Rokid携手海思共创XR生态，推出双目AR眼镜_小饭桌创业课堂&key=3301380851&pic=https://static-image.xfz.cn/1590028290_782.jpg">
						</a>
						<a class="share_wx"></a>
						<div class="show-qrcode">
							<p><img src="{% static 'images/qrcode.png'%}" alt="Alternate Text" /></p>
							<p>打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮</p>
						</div>

					</div>
				</div>
			</div>
			<div class="content-lead">
				{{ news.desc }}
			</div>
			<article class="content-detail">
				{{ news.content|safe }}
			</article>
			<div class="advertise-spe">

			</div>
			<div class="author">

			</div>
			<div class="comment-wrapper">
				<h3 class="title">文章评论（0）</h3>
				<textarea name="comment" id="" class="comment-textarea nologin-textarea logined-textarea" placeholder="立即登录 参与评论"></textarea>
				<div class="submit-btn-group">
					<button class="submit-btn" data-news-id="{{ news.id }}">
						立即评论
					</button>
				</div>
				<ul class="comment-list">
					{% for comment in comments %}
						<li>
							<div class="comment-info">
								<img class="avatar" src="{% static 'images/user.jpg' %}" alt="Alternate Text" />
								<span class="author">{{ comment.author.username }}</span>
								<span class="pub-time">{{ comment.pub_time|time_since }}</span>
							</div>
							<p class="comment-content">
								{{ comment.content }}
							</p>
						</li>
					{% endfor %}
				</ul>
			</div>
		</div>
		{% include 'common/sidebar.html' %}
	</div>
</div>
{% endblock %}